import React, { memo, useEffect, useRef, useState } from "react";
import axios from "@/utils/axios";
import { Search } from 'react-vant';
import { useNavigate } from "react-router-dom";
import { NavBar } from 'react-vant';
import { ProductCard } from 'react-vant';
const Index = memo(() => {
    const joop = useNavigate();
    const [list, setlist] = useState([])
    const ff = useRef<any>('')
    const onsearch = (value: string) => {
        console.log(value)
    }
    useEffect(() => {
        (
            async () => {
                const res = await axios.get('/date')
                setlist(res.data.data.list)
            }
        )
            ()
    }, [])
    return (
        <div>
            <NavBar
                title="搜索页"
                leftText="返回"
                rightText="按钮"
                onClickLeft={() => joop('/home')}
            />
            <Search ref={ff}
                shape="round"
                background="#4fc08d"
                value={''}
                onSearch={() => onsearch(ff.current.state.value)}
                placeholder="请输入搜索关键词"
            />
            {
                list.map((item: any, index: number) => {
                    return <ProductCard
                        key={index}
                        desc={item.shanc}
                        title={item.name}
                        thumb={item.image}
                    />
                })
            }

        </div>
    )
})

export default Index
